<template>
  <grimm-page title="EmptyStatus">
    <div slot="content" class="content">
      <grimm-button class="btn" type="default" @click="goEmptyPage(0)">无数据 - 基础</grimm-button>
      <grimm-button class="btn" type="default" @click="goEmptyPage(1)">无数据 - 带操作按钮</grimm-button>
      <grimm-button class="btn" type="default" @click="goEmptyPage(2)">无网络 - 基础</grimm-button>
      <grimm-button class="btn" type="default" @click="goEmptyPage(3)">无网络 - 带操作按钮</grimm-button>
    </div>
  </grimm-page>
</template>

<script>
import GrimmPage from '../../components/GrimmPage.vue';
export default {
  components: {
    GrimmPage,
  },
  data() {
    return {
      pathList: ['/noDataBasic', '/noDataBtn', '/noNetworkBasic', '/noNetworkBtn'],
    };
  },
  mounted() {},
  methods: {
    goEmptyPage(index) {
      this.$router.push(this.pathList[index]);
    },
  },
};
</script>
<style lang="stylus"  scoped>
.content {
  display: flex;
  flex-direction: column;
}

.btn {
  margin-bottom: 20px;
}
</style>

